import { isFunction } from "./isFunction"
import { isFunctionComponent } from "./isFunctionComponent"
import { mountNativeElement } from "./mountNativeElement"

function buildFunctionComponent (vdom) {
  return vdom.type(vdom.props || {})
}
function buildClassComponent (vdom) {
  const component = new vdom.type(vdom.props || {})
  const nextVdom = component.render()
  nextVdom.component = component
  return nextVdom
}

export function mountComponent (vdom, container, oldDom) {
  let nextVdom = null
  let component = null
  if (isFunctionComponent(vdom)) {
    // 函数组件
    nextVdom = buildFunctionComponent(vdom)
  } else {
    // 类组件
    nextVdom = buildClassComponent(vdom)
    component = nextVdom.component
  }

  // 问题6：处理嵌套类、函数组件
  if (isFunction(nextVdom)) {
    mountComponent(nextVdom, container, oldDom)//递归处理
  } else {
    mountNativeElement(nextVdom, container, oldDom)
  }

  // 调用类组件ref
  if (component) {
    component.componentDidMount()
    if (component.props) {
      const { ref } = component.props
      console.log(ref)
      ref && ref(component)
    }
  }
}


